<template>
	<view class="container">
		<view class="item-title">
			Let's fix your issue
		</view>
		<list-cell v-for="(item,key) in issueList" :key="item.goods_id" :title="item.goods_name" @eventClick="goFixPage(item.goods_id)"></list-cell>
		<!-- <view class="item-title">
			Let's know your issue
		</view> -->
		<!-- <list-cell v-for="(item,key) in issueKnowList" :key="key" :title="item.value" @eventClick="goDetailPage(item)"></list-cell> -->
		<uni-load-more :status="loadStatus"></uni-load-more>
	</view>
</template>

<script>
	import listCell from '@/components/mix-list-cell';
	import uniLoadMore from "@/components/uni-load-more/uni-load-more.vue"
	export default {
		components: {
			listCell,
			uniLoadMore
		},
		data() {
			return {
				issueList: [],
				issueKnowList: [],
				gc_id: '',
				gc_name: '',
				loadStatus: 'noMore',
				pageInfo: {
					page: 1,	// 当前页
					limit: 15, // 每页显示数量
				}
			}
		},
		onLoad(options) {
			if(options.gc_id) {
				this.gc_id = options.gc_id
			}
			this.loadData();
		},
		methods: {
			async loadData() {
				let data = {
					gc_id: this.gc_id,
					page: this.pageInfo.page,
					per_page: this.pageInfo.limit
				}
				let _this = this
				this.loadStatus = 'loading'
				this.$api.goodsList(data, res => {
					if(res.code === 1) {
						let list = res.data.data || [];
						_this.issueList = [..._this.issueList, ...list]
						let gc_names = Array.from(new Set(_this.issueList.map(item => item.gc_name)))
						if(gc_names.length > 0) {
							_this.gc_name = gc_names[0]
							uni.setNavigationBarTitle({
								 title: _this.gc_name
							})
						}
						
						if(parseInt(res.data.current_page) < res.data.last_page) {
							_this.pageInfo.page++
							_this.loadStatus = 'more'
						} else {
							_this.loadStatus = 'noMore'
						}
					}
				})
			},
			goFixPage(val) {
				this.$common.navigateTo('../services?goods_id=' + val)
			},
			goDetailPage() {
				this.$common.navigateTo('aircon1')
			}
		},
		// 页面下拉到底部触发
		onReachBottom () {
			if (this.loadStatus == 'more') {
				this.loadData()
			}
		}
	}
</script>

<style lang="scss">
.item-title {
	font-size: $font-lg + 4upx;
	font-weight: bold;
	padding: 48rpx 44rpx;
	border-bottom: 2rpx solid #E5E5E5;
}
</style>
